<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AZ24-ORDER</title>
<script type="text/javascript" src="js/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>

<body>
	<div id="wrapper">
		<div id="user_taskbar">
        	<div class="main clearfix">
            	<div class="l-task">
                	<ul class="login">
                    	<li>
                        	<a href="login.html" rel="nofollow"><strong>Đăng nhập</strong></a>
                        </li>
                        <li class="no-bg">
                        	<a href="register.html" rel="nofollow"><strong>Đăng kí</strong></a>
                        </li>
                    </ul>
                    <ul class="list-notice">
                    	<li id="li_show_item_in_cart">
                        	<a href="#" rel="nofollow" title="Giỏ hàng"> <span class="cart">&nbsp;</span> </a>
                        </li>
                        <li id="help_az_store">
                        	<a href="#" rel="nofollow" title="Liên hệ"> <span class="phone">&nbsp;</span> </a>
                        </li>
                    </ul>
                </div>
                <div class="r-task">
                	<input id="searchBox" type="text" placeholder="Search" name="q" />
                </div>
            </div>
        </div>
        <div class="spacediv"></div>
        <div id="page" class="main">
            <div id="header">
                <div class="clearfix">
                    <div class="logo">
                        <a href="index.html" title="AZ24-Order">
                            <img alt="logo az24" src="images/logo.gif" />
                        </a>
                    </div>
                </div>
            </div>
            <div class="clearfix"></div>
            <div id="content">
				<div id="center_column" class="center_column">
					<div class="breadcrumb bordercolor">
						<div class="breadcrumb_inner">
							<a title="Quay về trang chủ" href="index.html">
								<span class="ic_home">Trang chủ</span>
							</a>
							<span class="navigation-pipe">></span>
							<span class="navigation_page">Giỏ hàng</span>
						</div>
					</div>
					<h1 id="cart_title">Thông tin giỏ hàng</h1>
					<ul class="order_steps step1">
						<li class="step_current">
							<span>Thông tin giỏ hàng</span>
						</li>
						<li class="step_todo">
							<span>Xác nhận thông tin</span>
						</li>
						<li class="step_todo">
							<span>Chọn dịch vụ order</span>
						</li>
						<li class="step_todo" id="step_end">
							<span>Hoàn thành</span>
						</li>
					</ul>
					<p class="warning displayNone" id="emptyCartWarning">Không có sản phẩm nào trong giỏ hàng.</p>
					<p class="p-cart" id="cartSummary">Có <b id="productQty">5</b> sản phẩm trong giỏ hàng.</p>
					<div id="order-detail-content" class="table_block">
						<table id="cart_summary" class="std">
							<thead>
								<tr>
									<th class="cart_checkbox"></th>
									<th class="cart_product_item">Sản phẩm</th>
									<th class="cart_description_item">Thông tin sản phẩm</th>
									<th class="cart_unit_price">Đơn giá</th>
									<th class="cart_unit_qty">Số lượng</th>
									<th class="cart_total">Tổng</th>
								</tr>
							</thead>
							<tbody>
								<tr id="taobao_products" class="product_source">
									<td colspan="6">
										<div class="toggle expandBtn"></div>
										Hàng taobao + paipai
									</td>
								</tr>
								<tr class="cart_item taobao_product">
									<td><input type="checkbox" /></td>
									<td>
										<a href="#"><img alt="Áo ngực hình bướm" src="images/products/bra-01_small.png" /></a>
									</td>
									<td>
										<h5><a class="product_link" href="#">Áo ngực hình bướm X6 sẫm màu</a></h5>
									</td>
									<td class="right">
										<span class="price">88.700 VND</span>
									</td>
									<td class="cart_quantity">
										<div id="cart_quantity_button">
											<a title="Thêm sản phẩm" href="#" class="cart_quantity_up" rel="nofollow"><img alt="Thêm" src="images/quantity_up.png" /></a>
											<input type="text" value="1" size="2" class="cart_quantity_input text" />
											<a title="Bớt sản phẩm" href="#" class="cart_quantity_down" rel="nofollow"><img alt="Bớt" src="images/quantity_down.png" /></a>
										</div>
										<a title="Xóa sản phẩm" href="#" rel="nofollow" class="cart_quantity_delete"><img class="icon" alt="Xóa" src="images/delete-cart.gif" /></a>
									</td>
									<td class="right">
										<span class="price">88.700 VND</span>
									</td>
								</tr>
								<tr class="cart_item taobao_product">
									<td><input type="checkbox" /></td>
									<td>
										<a href="#"><img alt="Áo sơ mi nữ Hàn quốc 2012" src="images/products/ao-01_small.png" /></a>
									</td>
									<td>
										<h5><a class="product_link" href="#">Áo sơ mi nữ Hàn quốc 2012</a></h5>
									</td>
									<td class="right">
										<span class="price">110.000 VND</span>
									</td>
									<td class="cart_quantity">
										<div id="cart_quantity_button">
											<a title="Thêm sản phẩm" href="#" class="cart_quantity_up" rel="nofollow"><img alt="Thêm" src="images/quantity_up.png" /></a>
											<input type="text" value="2" size="2" class="cart_quantity_input text" />
											<a title="Bớt sản phẩm" href="#" class="cart_quantity_down" rel="nofollow"><img alt="Bớt" src="images/quantity_down.png" /></a>
										</div>
										<a title="Xóa sản phẩm" href="#" rel="nofollow" class="cart_quantity_delete"><img class="icon" alt="Xóa" src="images/delete-cart.gif" /></a>
									</td>
									<td class="right">
										<span class="price">220.000 VND</span>
									</td>
								</tr>
								<tr class="cart_item taobao_product">
									<td><input type="checkbox" /></td>
									<td>
										<a href="#"><img alt="Áo phông cổ tròn" src="images/products/ao-02_small.png" /></a>
									</td>
									<td>
										<h5><a class="product_link" href="#">Áo phông cổ tròn</a></h5>
									</td>
									<td class="right">
										<span class="price">265.000 VND</span>
									</td>
									<td class="cart_quantity">
										<div id="cart_quantity_button">
											<a title="Thêm sản phẩm" href="#" class="cart_quantity_up" rel="nofollow"><img alt="Thêm" src="images/quantity_up.png" /></a>
											<input type="text" value="1" size="2" class="cart_quantity_input text" />
											<a title="Bớt sản phẩm" href="#" class="cart_quantity_down" rel="nofollow"><img alt="Bớt" src="images/quantity_down.png" /></a>
										</div>
										<a title="Xóa sản phẩm" href="#" rel="nofollow" class="cart_quantity_delete"><img class="icon" alt="Xóa" src="images/delete-cart.gif" /></a>
									</td>
									<td class="right">
										<span class="price">265.000 VND</span>
									</td>
								</tr>
								<tr class="cart_item taobao_product">
									<td><input type="checkbox" /></td>
									<td>
										<a href="#"><img alt="Quần hè thời trang Hàn Quốc" src="images/products/quan-01_small.png" /></a>
									</td>
									<td>
										<h5><a class="product_link" href="#">Quần hè thời trang Hàn Quốc</a></h5>
									</td>
									<td class="right">
										<span class="price">126.000 VND</span>
									</td>
									<td class="cart_quantity">
										<div id="cart_quantity_button">
											<a title="Thêm sản phẩm" href="#" class="cart_quantity_up" rel="nofollow"><img alt="Thêm" src="images/quantity_up.png" /></a>
											<input type="text" value="1" size="2" class="cart_quantity_input text" />
											<a title="Bớt sản phẩm" href="#" class="cart_quantity_down" rel="nofollow"><img alt="Bớt" src="images/quantity_down.png" /></a>
										</div>
										<a title="Xóa sản phẩm" href="#" rel="nofollow" class="cart_quantity_delete"><img class="icon" alt="Xóa" src="images/delete-cart.gif" /></a>
									</td>
									<td class="right">
										<span class="price">126.000 VND</span>
									</td>
								</tr>

								<tr id="alibaba_products" class="product_source">
									<td colspan="6"><div class="toggle expandBtn"></div>Hàng Alibaba</td>
								</tr>
								<tr class="cart_item alibaba_product">
									<td><input type="checkbox" /></td>
									<td>
										<a href="#"><img alt="Jacket Hàn Quốc - Mirror Fun" src="images/products/jacket-01_small.png" /></a>
									</td>
									<td>
										<h5><a class="product_link" href="#">Jacket Hàn Quốc - Mirror Fun</a></h5>
									</td>
									<td class="right">
										<span class="price">250.000 VND</span>
									</td>
									<td class="cart_quantity">
										<div id="cart_quantity_button">
											<a title="Thêm sản phẩm" href="#" class="cart_quantity_up" rel="nofollow"><img alt="Thêm" src="images/quantity_up.png" /></a>
											<input type="text" value="1" size="2" class="cart_quantity_input text" />
											<a title="Bớt sản phẩm" href="#" class="cart_quantity_down" rel="nofollow"><img alt="Bớt" src="images/quantity_down.png" /></a>
										</div>
										<a title="Xóa sản phẩm" href="#" rel="nofollow" class="cart_quantity_delete"><img class="icon" alt="Xóa" src="images/delete-cart.gif" /></a>
									</td>
									<td class="right">
										<span class="price">250.000 VND</span>
									</td>
								</tr>

								<tr id="other_products" class="product_source">
									<td colspan="6">Hàng xưởng</td>
								</tr>
								<tr>
									<td colspan="6" class="no_product">Không có sản phẩm nào.</td>
								</tr>
							</tbody>
							<tfoot>
								<tr class="cart_total_price">
									<td colspan="5">Tổng:</td>
									<td class="right" id="total_price">
										<span class="price">949.700 VND</span>
									</td>
								</tr>
							</tfoot>
						</table>
					</div>
					<div id="final_cart_summary">
						<div class="heading">Giỏ hàng</div>
						<div class="purchase_summary">
							<span>Tổng tiền</span>
							<p class="total_price">949.700 VND</p>
							<a title="Xác nhận thông tin" class="primary-button width_120" href="cart1.html">Gửi đơn hàng »</a>
						</div>
					</div>
					<p class="cart_navigation">
						<a title="Tiếp tục mua hàng" href="index.html" class="primary-button width_150 float_left">« Tiếp tục mua hàng</a>
					</p>
				</div>
            </div>

            <div id="footer">
            	<div class="clearfix">
                	<div class="item-footer">
                    	<h3><b>Giới thiệu</b></h3>
                        <ul class="list-col">
                            <li><a href="#" target="_blank">Giới thiệu chung</a></li>
                            <li><a href="#" target="_blank">Tin tức mới</a></li>
                            <li><a href="#" target="_blank">Tuyển dụng</a></li>
                            <li><a href="#" target="_blank">Liên hệ</a></li>
                        </ul>
                    </div>
                    <div class="item-footer">
                    	<h3><b>Người mua cần biết</b></h3>
                        <ul class="list-col">
                            <li><a href="#" target="_blank">Đăng ký tài khoản</a></li>
                            <li><a href="#" target="_blank">Hướng dẫn nạp tiền vào tài khoản</a></li>
                            <li><a href="#" target="_blank">Hướng dẫn mua hàng</a></li>
                            <li><a href="#" target="_blank">Đánh giá người bán</a></li>
                        </ul>
                    </div>
                    <div class="item-footer">
                    	<h3><b>Người bán cần biết</b></h3>
                        <ul class="list-col">
                            <li><a href="#" target="_blank">Đăng ký gian hàng</a></li>
                            <li><a href="#" target="_blank">Gian hàng cơ bản</a></li>
                            <li><a href="#" target="_blank">Gian hàng chuyên nghiệp</a></li>
                            <li><a href="#" target="_blank">Bạn cần biết</a></li>
                        </ul>
                    </div>
                    <div class="item-footer">
                    	<h3><b>Dịch vụ</b></h3>
                        <ul class="list-col">
                            <li><a href="#" target="_blank">Mua bán theo sự kiện</a></li>
                            <li><a href="#" target="_blank">Mua bán bộ sản phẩm</a></li>
                            <li><a href="#" target="_blank">Quảng cáo</a></li>
                            <li><a href="#" target="_blank">Đăng tin rao vặt</a></li>
                        </ul>
                    </div>
                    <div class="item-footer">
                    	<h3><b>Liên kết</b></h3>
                        <ul class="list-col">
                            <li><a href="#" target="_blank">Tinhte.vn</a></li>
                            <li><a href="#" target="_blank">Raovat.net</a></li>
                            <li><a href="#" target="_blank">Muaban24h.com</a></li>
                            <li><a href="#" target="_blank">Vozforums.com</a></li>
                        </ul>
                    </div>
                </div>
                <div class="clearfix">
                    <div id="site-copyright">Copyright © 2012 FSOFT.  All rights reserved.</div>
                </div>
            </div>
        </div>
	</div>
    <p id="back-top" style="display: none;"> <a href="#top" id="back-to-top" title="Back to top"><span></span></a> </p>
    <script type="text/javascript">
		var timer = null;
		var msie6 = $.browser == 'msie' && $.browser.version < 7;
		if (!msie6) {
			var _top = $("#final_cart_summary").offset().top - parseFloat($("#final_cart_summary").css("margin-top").replace(/auto/, 0));
		}

		$(window).scroll(function(e) {
			if (timer != null) {
				clearTimeout(timer);
			}

			var y = $(this).scrollTop();

	      	// whether that's below the form
	      	if (y >= _top) {
	        	// if so, ad the fixed class
	        	$("#final_cart_summary").addClass("fixed");
	      	} else {
	        	// otherwise remove it
	        	$("#final_cart_summary").removeClass("fixed");
	      	}

			timer = setTimeout(function() {
				timer = null;

				var scrollPos = $(window).scrollTop();

				if (scrollPos > 200) {
					$("#back-top").css("display', 'block");
				} else {
					$("#back-top").css("display', 'none");
				}
			}, 100);

		});

		$(document).ready(function() {
			$(".toggle").click(function() {
				if ($(this).hasClass("expandBtn")) {
					$(this).removeClass("expandBtn").addClass("collapseBtn");
				} else if ($(this).hasClass("collapseBtn")) {
					$(this).removeClass("collapseBtn").addClass("expandBtn");
				}

				var _parentId = $(this).parent().parent().attr("id");
				if (_parentId == "taobao_products") {
					$(".taobao_product").slideToggle(200);
				} else if (_parentId == "alibaba_products") {
					$(".alibaba_product").slideToggle(200);
				} else if (_parentId == "other_products") {
					$(".other_product").slideToggle(200);
				}
			});

			var _intRegex = /^-?\d+$/;
			$(".cart_quantity_up").click(function() {
				var _qtyFld = $(this).next();
				var _qty = $.trim(_qtyFld.val());
				if (_qty != '' && (isNaN(_qty) || !_intRegex.test(_qty)) ) {
					_qty = 0;
				}

				_qty++;
				_qtyFld.val(_qty);
			});

			$(".cart_quantity_down").click(function() {
				var _qtyFld = $(this).prev();
				var _qty = $.trim(_qtyFld.val());
				if (_qty != '' && (isNaN(_qty) || !_intRegex.test(_qty)) ) {
					_qty = 0;
				}

				if (_qty > 0) {
					_qty--;

					if (_qty == 0) {
						var answer = confirm("Are you sure you want to delete this item?");
					    if (answer) {
					    	deleteProduct($(this));
					    } else {
					    	_qtyFld.val(_qty);
					    }
					} else {
						_qtyFld.val(_qty);
					}
				}
			});

			$(".cart_quantity_delete").click(function() {
				var answer = confirm("Are you sure you want to delete this item?");
				if (answer) {
					deleteProduct($(this));
				}
			});

			function deleteProduct(obj) {
				var _tr = obj.parents("tr");
		    	var _tbody = obj.parents("tbody");
				var _remains;
				var _noProduct = "<tr><td colspan='6' class='no_product'>Không có sản phẩm nào.</td></tr>";

		    	if (_tr.hasClass("taobao_product")) {
		    		_remains = _tbody.find(".taobao_product").length - 1;
		    		_tr.remove();
					$("#productQty").text(parseInt($("#productQty").text()) - 1);

		    		if (_remains == 0) {
						$("#taobao_products div.toggle").remove();
						$("#taobao_products").after(_noProduct);
						checkEmptyCart();
					}
		    	} else if (_tr.hasClass("alibaba_product")) {
		    		_remains = _tbody.find(".alibaba_product").length - 1;
		    		_tr.remove();
		    		$("#productQty").text(parseInt($("#productQty").text()) - 1);

					if (_remains == 0) {
						$("#alibaba_products div.toggle").remove();
						$("#alibaba_products").after(_noProduct);
						checkEmptyCart();
					}
		    	} else if (_tr.hasClass("other_product")) {
		    		_remains = _tbody.find(".other_product").length - 1;
		    		_tr.remove();
		    		$("#productQty").val($("#productQty").val() - 1);

					if (_remains == 0) {
						$("#other_products div.toggle").remove();
						$("#other_products").after(_noProduct);
						checkEmptyCart();
					}
		    	}
			}

			function checkEmptyCart() {
				var _tbody = $("#cart_summary tbody");
				if (_tbody.find(".alibaba_product").length == 0
						&& _tbody.find(".other_product").length == 0
						&& _tbody.find(".taobao_product").length == 0) {
					$("#order-detail-content").remove();
					$("#cartSummary").remove();
					$("#final_cart_summary").remove();
					$("#emptyCartWarning").removeClass("displayNone");
				}
			}
		});
	</script>
</body>
</html>
